import React from 'react';
import { Provider } from 'react-redux'
import { browserHistory } from 'react-router';
import { storiesOf, action } from '@kadira/storybook';
import { muiTheme } from 'storybook-addon-material-ui';
import configureStore from '../../stores/configureStore';
import BodyDataInput from './BodyDataInput';
import { BodyDataInputContextConstant } from '../../constants/ComponentContextConstants';
import { ErrorInfo } from '../../validations/';
import * as Q from './questions';
import 'normalize.css';
import '../../App.css';
/*global module*/

const store = configureStore(browserHistory);

storiesOf('入力画面', module)
  .addDecorator(muiTheme())
  .addDecorator((getStory) => (
    <Provider store={store}>
      { getStory() }
    </Provider>
  ))
    .add('to 入力画面', () => (
      <BodyDataInput
        onAction={action('入力完了')}
        onCancel={action('戻る')}
      />
    ))
    .add('Q01.基本情報', () => (
      <TestQuestion pageIndex={0}>
        <Q.Question01/>
      </TestQuestion>
    ))
    .add('Q02.喫煙習慣', () => (
      <TestQuestion pageIndex={1}>
        <Q.Question02/>
      </TestQuestion>
    ))
    .add('Q03.飲酒習慣', () => (
      <TestQuestion pageIndex={2}>
        <Q.Question03/>
      </TestQuestion>
    ))
    .add('Q04.飲酒頻度', () => (
      <TestQuestion pageIndex={3}>
        <Q.Question04/>
      </TestQuestion>
    ))
    .add('Q05.飲酒量', () => (
      <TestQuestion pageIndex={4}>
        <Q.Question05/>
      </TestQuestion>
    ))
    .add('Q06.運動習慣（1/3）', () => (
      <TestQuestion pageIndex={5}>
        <Q.Question06_01/>
      </TestQuestion>
    ))
    .add('Q06.運動習慣（2/3）', () => (
      <TestQuestion pageIndex={6}>
        <Q.Question06_02/>
      </TestQuestion>
    ))
    .add('Q06.運動習慣（3/3）', () => (
      <TestQuestion pageIndex={7}>
        <Q.Question06_03/>
      </TestQuestion>
    ))
    .add('Q07.塩蔵品', () => (
      <TestQuestion pageIndex={8}>
        <Q.Question07/>
      </TestQuestion>
    ))
    .add('Q08.糖尿病', () => (
      <TestQuestion pageIndex={9}>
        <Q.Question08/>
      </TestQuestion>
    ))
    .add('Q09.血糖値', () => (
      <TestQuestion pageIndex={10}>
        <Q.Question09/>
      </TestQuestion>
    ))
    .add('Q10.降圧剤', () => (
      <TestQuestion pageIndex={11}>
        <Q.Question10/>
      </TestQuestion>
    ))
    .add('Q11.血圧', () => (
      <TestQuestion pageIndex={12}>
        <Q.Question11/>
      </TestQuestion>
    ))
    .add('Q12.コレステロール', () => (
      <TestQuestion pageIndex={13}>
        <Q.Question12/>
      </TestQuestion>
    ))
    .add('Q13.家族の既往歴', () => (
      <TestQuestion pageIndex={14}>
        <Q.Question13/>
      </TestQuestion>
    ))
    .add('Q14.抗体検査', () => (
      <TestQuestion pageIndex={15}>
        <Q.Question14/>
      </TestQuestion>
    ))
    .add('Q15.慢性胃炎', () => (
      <TestQuestion pageIndex={16}>
        <Q.Question15/>
      </TestQuestion>
    ));

/**
 * テスト用:質問ページの親コンポーネント
 */
class TestQuestion extends React.Component {
  render() {
    return (
      <div>
        {this.props.children}
      </div>
    );
  }

  getChildContext() {
    return Object.freeze({
      parent: Object.freeze({
        inputData: Object.freeze(this.props.inputData),
        errorInfo: Object.freeze(this.props.errorInfo),
        pageIndex: this.props.pageIndex,
        updateState: action('updateState'),
        handleSave: action('handleSave'),
        handleNext: action('handleNext'),
        handleBack: action('handleBack'),
        handleSelectAlcoholHabit: action('handleSelectAlcoholHabit'),
        handleSelectAlcoholFrequency: action('handleSelectAlcoholFrequency'),
        validateQuestionPage: action('validateQuestionPage'),
      }),
    });
  }
}
TestQuestion.childContextTypes = BodyDataInputContextConstant;
TestQuestion.defaultProps = {
  inputData: {},
  errorInfo: ErrorInfo.noneError(),
  pageIndex: 0,
};
